<template>
    <ynet-content id="printPIN" :headerInformation="true" :headerMenu="true" class="main-container">
        <div ><!--提示当前位置  电话银行交易查询-->
			<ynet-breadcrumb></ynet-breadcrumb>
		</div>
        <div  v-if="main">
            <el-form ref="queryForm" :model="queryForm" class="formEmbedTable mt20" :rules="rules">
                <table>
                    <caption>Enquiry</caption>
                    <tr>
                        <td>Date：</td>
                        <td colspan="3">
                            <el-form-item  prop="startDateObj">
                            <el-date-picker v-model="queryForm.startDateObj" @change="queryForm.startTime=$tools.utils.formatDate(queryForm.startDateObj)" type="date" placeholder="startTime"></el-date-picker>
                            </el-form-item>
                            <span> To </span>
                            <el-form-item  prop="endDateObj">
                            <el-date-picker v-model="queryForm.endDateObj" @change="queryForm.endTime=$tools.utils.formatDate(queryForm.endDateObj)" type="date" placeholder="endTime"></el-date-picker>
                            </el-form-item>               
                        </td>
                    </tr>	
                </table>
            </el-form>
            <div class="btnArea mt20 tac">
                <el-button type="primary" @click="query('queryForm')" >Search</el-button>
            </div>
            <div class="tableForm mt20  tableData">
                <el-table :data="tableData" border @select="handleChange">
                    <el-table-column type="selection" align="center" ></el-table-column>
                    <el-table-column label="Batch No" prop="batchNo" align="center">
                        <template scope="scope">
                            <a class="cBlue" @click="toDetail(scope.row.batchNo)">{{scope.row.batchNo}}</a>
                        </template>
                    </el-table-column>
                    <el-table-column label="Total" prop="totalNo" align="center"></el-table-column>
                    <el-table-column label="Print" prop="finished" align="center"></el-table-column>
                </el-table>
            </div>
            <div class="pagination tar mt20">
                <el-pagination  @current-change="handleCurrentChange" :current-page="Number(queryForm.currentPage)" :page-size="Number(queryForm.turnPageShowNum)" layout="total, prev, pager, next, jumper" :total="Number(turnPageTotalNum)">
                </el-pagination>
            </div>
            <div class="btnArea mt20 tac">
                <el-button type="primary" @click="print()">Print</el-button>
                <el-button type="primary" @click="TestPrint()">Test Print</el-button>
            </div>
        </div>
        <div v-if="isDetail">
            <PrintDetail :batchNo="batchNo"  @back="back"></PrintDetail>
        </div>
        <!--授权确认页面弹窗-->
        <div>
            <ynet-authDialog ref="dialogTable"  @getAuthForm="getAuthForm"></ynet-authDialog>
        </div>
    </ynet-content>
</template>

<script>
    import PrintDetail from './components/printPINDetail';
	export default {
		name:'printPIN',
		components:{
          PrintDetail,
		},
		data(){
            return { 
                main:true,turnPageTotalNum:'',isDetail:false,
                rules:{
                    startDateObj: [
                        {trigger: 'blur', validator:this.$tools.validator.dateCompare,compareList:['startDateObj','endDateObj'],vm:this,formName:'queryForm'}
                    ],
                    endDateObj: [
                        {trigger: 'blur', validator:this.$tools.validator.dateCompare,compareList:['startDateObj','endDateObj'],vm:this,formName:'queryForm'}
                    ],
                },
                needAuth:'',
                authType:'', 
                tableData:[],
                authForm: { authUserNo: '', password: '',randomField:''},//100004   617100
                queryForm:{
                    currentPage:'1', 
                    turnPageShowNum:'10',
                    startDateObj:'',
                    endDateObj:'',
                    startTime:'',
                    endTime:'',
                    bsnCode:'IM0406',
                },
                batchNo:'',
                selectData:[],
                addForm:{
                    printPinList:[],bsnCode:'IM0406',actionType:'0',
                }
            }   
        },
		methods:{ 
            TestPrint(){
                let _this=this;
                _this.$tools.request(_this,"IM0406TestAction.do").then(data=>{
                    console.log("data:"+JSON.stringify(data))
                    if(data.body.errorCode==0){
                        _this.$message.success('Send HSM')
                    }
                })
            },
            print(){
                let _this=this;
                _this.addForm.printPinList=_this.selectData;
                console.log("addForm"+JSON.stringify(this.addForm))
                _this.$tools.request(_this,"IM0406Action.do",_this.addForm).then(data=>{
                    console.log("data:"+JSON.stringify(data))
                    if(data.body.errorCode==0){
                        _this.$message.success('Send HSM')
                    }
                })
            },
            confirmBox(){
                let _this=this;
                _this.$confirm('Confirm to Print PIN',{
                    confirmButtonText:'Confirm',
                    cancelButtonText:'Cancel',
                    type:'warning'
                }).then(()=>{
                    _this.print();
                }).catch(()=>{
                    _this.$message({type:'info',message:'Canceled'})
                })
            },
            handleChange(val){//选择变化时
                let _this=this;
                console.log("val:"+JSON.stringify(val))
                _this.selectData=val;
            },
            toDetail(val){//打开该批次下详情
                console.log(val)
                this.batchNo=val;
                this.isDetail=true;
                this.main=false;
            },
            handleCurrentChange(val) {//查询分页方法
                this.queryForm.currentPage=val;
                this.queryChange()
            },
            resetForm(formName){
                this.$refs[formName].resetFields();
            },
            getAuthForm(val){
                //获取授权数据
                this.authForm=val;
                console.log("val:"+JSON.stringify(val))
                this.addForm=$.extend(this.addForm,this.authForm)
                this.typhoonAdd()  //自己页面提交给后台的.do方法
            },
            
            queryAuth(formName){//查询授权模式
                this.$refs[formName].validate((valid)=>{
                    if(valid){
                        let body={};body.bsnCode="IM0406";body.version="IM0406",
                        this.$tools.request(this,"IM010001Action.do",body).then(data=>{
                            if(data.body.errorCode==0){
                                if(data.body.needAuth==0){//无需授权
                                    this.typhoonAdd()
                                }else if(data.body.needAuth==1 && data.body.authType==1){
                                    this.needAuth=1;
                                    this.authType=1;
                                    this.$refs["dialogTable"].show()
                                            // this.dialogTableVisible=true;
                                }else if( data.body.needAuth==1 && data.body.authType==2 ){
                                    this.needAuth=1;
                                    this.authType=2;
                                    this.typhoonAdd()
                                }else{
                                    this.$alert('Authorization Type Error', {
                                        confirmButtonText: 'Confirm',
                                        callback: action => {
                                        }
                                    });
                                }
                            }else{
                                this.$alert("System Error Try again", "warning",{
                                    confirmButtonText: 'Confirm',
                                    callback: action => {
                                    }
                                });
                            }
                        })   
                    }
                })
                
			},          
            queryChange(){
                this.$tools.request(this,"IM0306QueryAction.do",this.queryForm).then(data=>{
                   console.log("data:"+JSON.stringify(data))
                   if(data.body.errorCode==0){
                        this.tableData=data.body.printPinList;
                        //this.turnPageTotalNum=data.body.turnPageTotalNum;
                   }else{
                       this.$alert("System Error Try again", "warning",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                   }
               })
            },
            query(val){//查询频率控制
                //console.log("val:"+JSON.stringify(val))
                this.queryForm.currentPage=1
                console.log("queryForm:"+JSON.stringify(this.queryForm))
                this.queryChange()
            },
            back(){
                this.main=true;
                this.isDetail=false;
            }
            
		}
	}
</script>